<template>
	<view class="active">
		<van-nav-bar title="修改密码" left-arrow @click-left="onClickLeft" />
		<van-field class="name" password="true" label="原密码" left-icon="closed-eye" :value="oldPassWord" @change="oldPassWordChange"
		 placeholder="请输入原密码" @blur="oldpw" />
		<van-field class="name" password="true" label="新密码" left-icon="closed-eye" :value="newPassWord1" @change="newPassWord1Change"
		 placeholder="数字,英文,字符中两种以上,长度6-20" @blur="newpw1" />
		<van-field class="name" password="true" label="确认密码" left-icon="closed-eye" :value="newPassWord2" @change="newPassWord2Change"
		 placeholder="请输入确认密码" @blur="newpw2" />
		</van-nav-bar>
		<view class="btn">
			<van-button class="btn" type="primary" block color="#3578E5" @tap="btnSubmitEvent">{{submit}}</van-button>
		</view>

	</view>
</template>

<script>
	export default {
		data() {
			return {
				submit: "确 认 提 交",
				oldPassWord: "",
				newPassWord1: "",
				newPassWord2: "",
			}
		},
		methods: {
			oldPassWordChange(old) {
				this.oldPassWord = old.detail;
			},
			newPassWord1Change(new1) {
				this.newPassWord1 = new1.detail;
			},
			newPassWord2Change(new2) {
				this.newPassWord2 = new2.detail
			},
			onClickLeft() {
				uni.navigateBack({
					delte: 1
				})
			},
			btnSubmitEvent() {
				if (this.oldPassWord == "" || this.newPassWord1 == "" || this.newPassWord2 == "") {
					uni.showToast({
						title: '内容不能为空',
						icon: 'loading'
					})
				}else{
				   uni.navigateBack({
				   	delta:1
				   })
				}
			},
			oldpw() {
				if (!/(?=.*([a-zA-Z].*))(?=.*[0-9].*)[a-zA-Z0-9-*/+.~!@#$%^&*()]{6,20}$/.test(this.oldPassWord)) {
					uni.showToast({
					    title: '原密码格式错误',
					    icon:'loading'
					})
					return;
				}
			},
			newpw1() {
				if (!/(?=.*([a-zA-Z].*))(?=.*[0-9].*)[a-zA-Z0-9-*/+.~!@#$%^&*()]{6,20}$/.test(this.newPassWord1)) {
					uni.showToast({
					    title: '新密码格式错误',
					    icon:'loading'
					})
					return;
				}
			},
			newpw2() {
				if (!/(?=.*([a-zA-Z].*))(?=.*[0-9].*)[a-zA-Z0-9-*/+.~!@#$%^&*()]{6,20}$/.test(this.newPassWord2)) {
					uni.showToast({
					    title: '确认密码格式错误',
					    icon:'loading'
					})
					return;
				}
			}
		}
	}
</script>

<style>
	body {
		background-color: #F0F0F0;
	}

	.name {
		margin-top: 2upx;
		display: block;
		background-color: #007AFF;
	}

	.btn {
		width: 70%;
		margin: 0 auto;
		margin-top: 50px;
		border-rad: ;
	}
</style>
